<template>
  <div class="about">
    <h1>This is an about page</h1>
    <h2>{{ $store.state.count }}</h2>
    <hr />
    {{ count }}

    <button @click="changeCount">点击更改count</button>

    <button @click="changeCount2">点击更改count 并且带参数</button>
  
  <hr>

<button @click='asyncChangeCount'>异步改变count</button>


<hr>


<h1> 获取getters 里面的 数组的和: {{$store.getters.sumArr}}</h1>
  </div>
</template>

<script>
import {ADDCOUNT} from '../store/mutation-types'
export default {
  data() {
    return {};
  },

  methods: {
    changeCount() {
      console.log(this);
      //  this.$store.commit('mutations里面的方法名字')
      // this.$store.commit("addCount");
         this.$store.commit(ADDCOUNT);
    },
    // 传递参数
    changeCount2() {
      //  this.$store.commit('mutations里面的方法名字','传递的值')
      // this.$store.commit("addCount", 100);
      this.$store.commit(ADDCOUNT, 100);



    },
    // changeCount2(data) {

    //   this.$store.commit("addCount", data);
    // },



// 定义触发 异步的actions的方法 (异步)


asyncChangeCount() {
  // this.$store.dispatch('actions里面的方法名字')
  this.$store.dispatch('asyncAddCount')


}




  },

  computed: {
    //  aboutCount() {
    //    return  this.$store.state.count
    //  }
    count() {
      return this.$store.state.count;
    },
  },
};
</script>
